<!-- 1.引入文件,记得步骤，引入以下的文件 -->
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <!-- 当使用ie浏览器 来访问当前页面的时候 自动把ie的浏览器的内核切换最高版本   -->
    <!-- 有时候没有效果 ie 你懂的。。。  -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1,minimum-scale=1,user-scalable=no" />
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>Document</title>
    <link rel="stylesheet" href="./lib/css/bootstrap.css">
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/index.css">
    <!-- 条件注释  less than  -->
    <!--[if lt IE 9]>
      <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
      <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
    <![endif]-->
</head>
<body>
    <!--优惠券头部-->
    <header>
        <div class="saverTicket sav">
            <!-- 左边部分 -->
            <a href="#" class="pull-left clearfix">
                <span class="glyphicon glyphicon-menu-left" aria-hidden="true"></span>
            </a>
            <!-- 右边部分 -->
            <a href="#" class="pull-right clearfix">
                <span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span>
            </a>
            <!-- 中间部分 -->
            <span class="saver-c">凑单品</span>
        </div>
    </header>
    <!-- 下拉菜单 -->
    <section>
        <div class="row">
            <div class="col-xs-3 col-sm-3 col-md-3">
                <div class="btn-group">
                    <!-- <span class=" btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        京东 <span class="caret"></span>
                    </span> -->
                    <div id='item-sp'>
                        <!-- <ul class="dropdown-menu">
                        <li><a href="#">京东</a></li>
                        <li><a href="#">一号店</a></li>
                        <li><a href="#">天猫超市</a></li>
                    </ul> -->
                    </div>
                </div>
            </div>
            <div class="col-xs-3 col-sm-3 col-md-3">
                <div class="btn-group">
                    <!-- <span class=" btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    华北 <span class="caret"></span>
                </span> -->
                    <div id='item-xx'>
                        <ul class="dropdown-menu">
                            <li><a href="#">京东</a></li>
                            <li><a href="#">一号店</a></li>
                            <li><a href="#">天猫超市</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="col-xs-3 col-sm-3 col-md-3">
                <div class="btn-group">
                    <span class="btn" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        全部价格 <span class="caret"></span>
                    </span>
                </div>
            </div>
            <div class="col-xs-3 col-sm-3 col-md-3">
                <span class="btn glyphicon glyphicon-search" aria-hidden="true"></span>
            </div>
        </div>
    </section>
    <!-- 菜单项 -->
    <section id='bgc'>
        <div class="item-shop">
         <div id='item-pro'>  
            <div class="row">
                <div class="col-xs-6">
                    <img src="./images/ic_trend (1).png" alt="">
                    <p>酷派大神 原装平板保护膜 适用</p>
                    <p>
                        <span class="price pull-left">￥0.50</span>
                        <span class="choudan pull-right">去凑单</span>
                    </p>
                 </div>
                </div>
        </div>
        </div>
    </section>
    <!-- 尾部区域 -->
    <footer id='footer'>
        <div class="row row-w">
            <div class="col-xs-4">
                <a href="#">登录</a>
            </div>
            <div class="col-xs-4">
                <a href="#">注册</a>
            </div>
            <div class="col-xs-4">
                <a href="#">
                    <span class="glyphicon glyphicon-arrow-up" aria-hidden="true"></span>
                    返回顶部</a>
            </div>
        </div>
        <p><a href="#">手机app下载</a> <a href="#">慢慢买手机版</a> -- 掌上比价平台</p>
        <p>m.manmanbuy.com </p>
    </footer>
</body>
<!--选择超市的模板渲染-->
<script type="text/html" id='item-shop'>
    <div class="col-xs-3 col-sm-3 col-md-3">
            <div class="btn-group">
                <span class=" btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                <span id='jingdong'>京东</span><span class="caret"></span>
                </span>      
                <ul class="dropdown-menu">
                    {{each result as value i}}
                    <li class='clearfix' data-shopid="{{value.shopId}}">
                        <a href="#">
                            {{value.shopName}}
                            <span class="glyphicon glyphicon-ok pull-right gouxuan hidden" aria-hidden="true"></span>
                        </a>     
                    </li>
                    {{/each}}  
                </ul>
            </div>
        </div>
</script>
<!-- 地区模板渲染 -->
<script type="text/html" id='item-xr'>
    <div class="row">
        <div class="btn-group">
                <span class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                   <span id='diqu'>华北</span>  <span class="caret"></span>
                </span>        
                <ul class="dropdown-menu">  
                    {{each result as value i}}    
                    <li data-areaid='{{value.areaId}}'><a href="#">{{value.areaName}}<span class="glyphicon glyphicon-ok pull-right gouxuan hidden" aria-hidden="true"></span></a></li>
                    {{/each}}
                </ul>   
            </div>
         </div>
</script>
<!-- 商品列表模板渲染 -->
<script type="text/html" id='item-splb'>
    <div class="item-shop">
        <div class="row">
         {{each result as value i}}
            <div class="col-xs-6 col-sm-6 col-md-6">
                <a href="#">
                  {{#value.productImg}}
                </a>
                <p id='wenzi'>{{value.productName}}</p>
                <p>
                    <span class="price pull-left clearfix">{{value.productPrice}}</span>
                    <span class="choudan pull-right clearfix">去凑单</span>
                </p>
            </div>
            {{/each}}
        </div>
    </div>
</script>
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="./lib/js/jquery.js"></script>
<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
<script src="./lib/js/bootstrap.js"></script>
<script src="./js/template.js"></script>
<!-- 引入优惠券页面文件 -->
<script src="./js/item.js"></script>
</html>





<!-- 

    
 -->